<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <ul class="ul">
        
    </ul>

    <!-- <script>
        // 使用fetch 渲染 /api/news返回的数据，简单一点，只渲染title 放到li中，最后放到ul中
        const ul = document.querySelector('.ul')
        const api = 'http://192.168.19.66:3000/api/news'

        fetch(api).then(res => res.json()).then(res => {
            console.log(res)
            const htmlArr = res.map(el => {
                return `<li>${el.title}</li>`
            })
            ul.innerHTML = htmlArr.join('')
        }).catch(err => {
            // catch可以捕获整个的错误，前面的.then() .then()
            console.log(err)
        })
        // 为什么promise对象可以链式调用  .then  .then   ? 
        // 因为.then()调用之后返回的是一个promsie对象，promise对象中本身就有then方法
    </script> -->
    <script src="./my-ajax/index.js"></script>
    <script>
        console.log(ajax)
        const api = 'http://192.168.19.66:3000/api/news'

        ajax(api).then(res => {
            console.log(res)
        })

        const api_login = 'http://ajax-api.itheima.net/login'
        // 要发送给后端的参数
        const params = {
            username: "admin",
            password: "123456"
        }

        ajax(api_login, params).then(res => {
            console.log(res)
        })
    </script>
</body>
</html>